<template>

<tr>
      <input type="checkbox" @click="changeFn()" name="" id="">
      <td>{{ item.name }}</td>
      <td>{{ item.price }}</td>
      <td>
        <button @click="jsClickFn()">-</button>
        {{ item.num }}
        <button @click="btnClickFn()">+</button>
      </td>
      <td>{{ item.price * item.num }}</td>
      <td><button @click="delFn()">删除</button></td>
    </tr>

</template>

<script>
export default {
  props: {
    item: {
      type: Object
    }
  },
  computed: {
  },
  data () {
    return {
    }
  },
  created () {
    // this.$store.state('goodList')
    console.log(this.item)
  },
  methods: {
    changeFn () {
      this.$store.commit('changeFn', {
        checked: this.item.checked
      })
    },
    // 添加点击事件
    btnClickFn () {
      const newNum = this.item.num + 1
      if (newNum < 1) return
      this.$store.commit('updateNum', {
        name: this.item.name,
        num: newNum
      })
    },
    jsClickFn () {
      const newNum = this.item.num - 1
      if (newNum < 1) return
      this.$store.commit('updateNum', {
        name: this.item.name,
        num: newNum
      })
    },
    delFn () {
      this.$store.commit('delFn', {
        name: this.item.name

      })
    }
  }
}
</script>

<style>
</style>
